<{include file="Public/top.html" }>
</head>
	<body>
    <div id="warpper" style="height: 700px;">
        <div class="content" >
            <div class="location">用户信息</div>
            <div class="topic">个人信息</div>
            <form action="<{u('update?uid='|cat:$obj.uid)}>" method="post" class="ui-form" id="addManagerForm">
            <div class="form-box border0 border-box">

                    <div class="ui-form-item inline-block">
                        <label class="ui-label">用户昵称</label>
                        <input type="text" class="ui-text"  name="nickname" value="<{$obj.nickname}>" required/>
                    </div>
                    <div class="ui-form-item inline-block">
                        <label class="ui-label mll00">用户标签</label>
                        <select name="tag" class="ui-select">
                            <{html_options options=$tag selected=$obj.userTag}>
                        </select>
                    </div>
                    <div class="ui-form-item inline-block">
                        <label class="ui-label">真实姓名</label>
                        <input type="text" class="ui-text"  name="realName" value="<{$obj.realName}>" required/>
                    </div>
                    <div class="ui-form-item inline-block" style="position: relative;">
                        <input type="hidden" name="province" value="<{$obj.province}>" id="province" />
                        <input type="hidden" value="<{$obj.provinceName}>" id="provinceName" />
                        <input type="hidden" name="city" value="<{$obj.city}>" id="city" />
                        <input type="hidden" value="<{$obj.cityName}>" id="cityName" />
                        <input type="hidden" name="district" value="<{$obj.district}>" id="district" />
                        <input type="hidden" value="<{$obj.districtName}>" id="districtName" />
                        <input type="hidden" name="street" value="<{$obj.street}>" id="street" />
                        <input type="hidden" value="<{$obj.streetName}>" id="streetName" />
                        <input type="hidden" value="<{$obj.province}>/<{$obj.city}>/<{$obj.district}>/<{$obj.street}>" id="selectAddress" />
                        <label class="ui-label mll00">详细地址</label>
                        <input class="ui-select" readonly type="text" id="showSelectAdd" value="<{$address}>" placeholder="省/市/区/街道/" style="padding-left:10px; width:220px;" onclick="TestBlack('carnub1');">
                        <div class="DistrictsBox carnubbox" id="carnub1" style="display:none; position:absolute; z-index:999">
                            <ul class="tab_topic">
                                <li id="tab_to_1" class="no"><a onclick="tab('tab',4,1)">省份</a></li>
                                <li id="tab_to_2" onclick="tab('tab',4,2)"><a>城市</a></li>
                                <li id="tab_to_3" onclick="tab('tab',4,3)"><a>区县</a></li>
                                <li id="tab_to_4" onclick="tab('tab',4,4)"><a>街道</a></li>
                            </ul>
                            <div class="tab_con">
                                <div id="tab_mo_1" class="Province" style="padding-top: 1px;">
                                    <{foreach from=$province item=group key=key}>
                                    <div class="ProvinceBox">
                                        <span><{$key}></span>
                                        <ul>
                                        <{if $group}>
                                            <{foreach from=$group item=item key=key}>
                                                <li id="<{$key}>" onclick='area_tab("tab",4,2,"<{$key}>","<{$item.short_name}>")'><{$item.short_name}></li>
                                            <{/foreach}>
                                        <{/if}>
                                        </ul>
                                    </div>
                                    <{/foreach}>
                                </div>
                                <div id="tab_mo_2" class="city" style="display:none;">
                                </div>
                                <div id="tab_mo_3" class="district" style="display:none;">
                                </div>
                                <div id="tab_mo_4"  class="street" style="display:none;">
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="ui-form-item inline-block">
                        <label class="ui-label">性 别</label>
                        <span class="ui-field">
                            <input type="radio" id="other" name="sex" value="3" <{if $obj.sex eq 3}>checked<{/if}> required><label for="other">保密</label>
                            <input type="radio" id="man" name="sex"  value="1" <{if $obj.sex eq 1}>checked<{/if}> required><label for="man">男</label>
                            <input type="radio" id="woman" name="sex" value="2" <{if $obj.sex eq 2}>checked<{/if}> required><label for="woman">女</label>
                        </span>
                    </div>
                    <div class="ui-form-item inline-block">
                        <label class="ui-label mll00">&nbsp;</label>
                        <input type="text" class="ui-text"  name="address" placeholder="xx街道xxx小区XX座XX号XXXX室" value="<{$obj.address}>" required/>
                    </div>
                    <div class="ui-form-item inline-block">
                        <label class="ui-label">出生日期</label>
                        <input name="birthday" value="<{$obj.birthday}>" type="text" id="" class="ui-text" onfocus="WdatePicker()" />
                    </div>

            </div>
            <div class="integral_btn-group">
                <input type="submit" value="提交" class="ui-button"/>
                <input type="reset" value="清空" class="ui-button fade-o-butn"/>
            </div>
            </form>
        </div>
    </div>

    <{include file="Public/foot.html" }>
		<script src="Public/Admin/js/tab.js"></script>
		<script>
            function TestBlack(TagName){
                var obj = document.getElementById(TagName);
                if(obj.style.display==""){
                    obj.style.display = "none";
                }else{
                    obj.style.display = "";

                    var address = $("#selectAddress").val();
                    addr = address.split("/");
                    var length = addr.length;
                    var askLevel = length+1;
                    var i;
                    for(i=0;i<length;i++){
                        if(addr[i] <= 0){
                            askLevel = parseInt(i+1);
                            break;
                        }
                    }
                    if(askLevel > 4) askLevel = 4;
                    tab('tab',4,askLevel);
                }
            }

            function tab(a,b,c) {
                for(i=1;i<=b;i++){
                    if(c==i)
                    {
                        // 判断选择模块
                        document.getElementById(a+"_mo_"+i).style.display = "block";  // 显示模块内容
                        document.getElementById(a+"_to_"+i).className = "no";   // 改变菜单为选中样式

                        var address = $("#selectAddress").val();
                        addr = address.split("/");
                        length = addr.length;
                        var arrLength = 0;
                        for(z=0;z<length;z++){
                            if(addr[z] > 0){
                                arrLength++;
                            }
                        }
                        if(c > arrLength+1){
                            //清空后两级数据(例如，只选择了省级数据，区和街道数据应清空)
                            for(var j=arrLength+2;j<=b;j++){
                                $("#"+a+"_mo_"+j).empty();
                            }
                        } else {
                            if(c==1){
                                //显示省级数据
                                $("#"+addr[0]).attr('class','active');
                            } else{
                                area_id = addr[c-2];
                                var param = {provinceID:addr[0],area_id:area_id,level:c};

                                $.post("<{U('User/getArea_info')}>",param,function (res) {
                                    if(res.status == 1){
//                                        layer.msg(res.msg);
                                    }else{
                                        $("#"+a+"_mo_"+c).empty().append(res.dataHtml);
                                        $("#"+addr[c-1]).attr('class','active');
                                    }
                                });
                            }

                        }
                    }
                    else{
                        // 没有选择的模块
                        document.getElementById(a+"_mo_"+i).style.display = "none"; // 隐藏没有选择的模块
                        document.getElementById(a+"_to_"+i).className = "";  // 清空没有选择的菜单样式
                    }
                }
            }

            function area_tab(a,b,c,id,name) {
                tab(a,b,c);
                orginalLevel = c-1;     //点击的那一级
                $("#"+a+"_mo_"+orginalLevel+" ul").find("li").each(function () {
                    if ($(this).hasClass('active')) {
                        $(this).removeClass('active');
                    }
                });
                switch (parseInt(c)){
                    case 2:
                        $("#province").val(id);
                        $("#provinceName").val(name);
                        $("#showSelectAdd").val(name);
                        $("#selectAddress").val(id);
                        $("#city,#district,#street").val('');
                        $("#cityName,#districtName,#streetName").val('');
                        break;
                    case 3:
                        $("#city").val(id);
                        $("#cityName").val(name);
                        $("#showSelectAdd").val($("#provinceName").val()+'/'+name);
                        $("#selectAddress").val($("#province").val()+'/'+id);
                        $("#district,#street").val('');
                        $("#districtName,#streetName").val('');
                        break;
                    case 4:
                        $("#district").val(id);
                        $("#districtName").val(name);
                        $("#showSelectAdd").val($("#provinceName").val()+'/'+$("#cityName").val()+'/'+name);
                        $("#selectAddress").val($("#province").val()+'/'+$("#city").val()+'/'+id);
                        $("#street").val('');
                        $("#streetName").val('');
                        break;
                    case 5:
                        $("#street").val(id);
                        $("#streetName").val(name);
                        $("#showSelectAdd").val($("#provinceName").val()+'/'+$("#cityName").val()+'/'+$("#districtName").val()+'/'+name);
                        $("#selectAddress").val($("#province").val()+'/'+$("#city").val()+'/'+$("#district").val()+'/'+id);
                        break;
                }
                $("#"+id).attr('class','active');
                if(c < 5){
                    var provinceID = $("#province").val();
                    var param = {provinceID:provinceID,area_id:id,level:c};
                    $.post("<{U('User/getArea_info')}>",param,function (res) {
                        if(res.status == 1){
                            layer.msg(res.msg);
                        }else{
                            $("#"+a+"_mo_"+c+"").empty().append(res.dataHtml);
                        }
                    });
                } else if(c == 5){
                    //关闭地址选择器
                    TestBlack('carnub1');
                }

            }
		</script>
	</body>
</html>